<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { RouterView } from 'vue-router';

const isLoading = ref(true);

onMounted(() => {
  clearLoading();
});

const clearLoading = () => {
  setTimeout(() => {
    isLoading.value = false;
  }, 3000)
}
</script>

<template>
  <RouterView />

  <div class="loading">
    <dv-loading v-if="isLoading">
      Loading...
    </dv-loading>
  </div>
</template>

<style scoped>
.loading {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
</style>
